<template>
  <div class="container">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="首页" name="Homme"></el-tab-pane>
      <el-tab-pane label="商品分类" name="Catagory"></el-tab-pane>
      <el-tab-pane label="热销" name="Hot"></el-tab-pane>
      <el-tab-pane label="新品" name="NewProduct"></el-tab-pane>
    </el-tabs>
    <div>
      <router-view/>
    </div>
  </div>

</template>

<script>

import { mapState } from "vuex";
export default {
  name: "Home",
  components: {
  },
  data() {
    return {
      activeName:'Homme'
    }

  }, 
  methods: {
    handleClick() {
      this.$router.replace({
        path:`/home/${this.activeName}`
      })
    }
  },
  //组件挂载完毕钩子
  mounted() {
    this.handleClick()
    this.$store.dispatch("getFloorList");

  },
  computed: {
  },
};
</script>

<style scoped>
.container {
  width: 1200px;
  margin: 0 auto;
}

</style>
